@model WorkFlowCore.BusinessDemo.Web.Models.AutoLoginViewModel
@{
    ViewData["Title"] = "自动登录演示";
}

<div class="container mt-4">
    <div class="card">
        <div class="card-header">
            <h2>自动登录演示</h2>
        </div>
        <div class="card-body">
            <div class="alert alert-info">
                <p>本页面演示如何从业务系统自动登录到WorkFlowCore工作流引擎。</p>
                <p>点击下方链接将使用当前登录用户的Token自动登录到工作流引擎。</p>
            </div>

            @if (Model != null)
            {
                <div class="mb-4">
                    <h4>当前用户信息</h4>
                    <table class="table table-bordered">
                        <tr>
                            <th>用户名</th>
                            <td>@Model.UserName</td>
                        </tr>
                        <tr>
                            <th>用户ID</th>
                            <td>@Model.UserId</td>
                        </tr>
                    </table>
                </div>

                <div class="mb-4">
                    <h4>Host项目基础URL</h4>
                    <form method="post" class="mb-3">
                        <div class="input-group">
                            <input type="text" class="form-control" name="hostBaseUrl" value="@Model.HostBaseUrl" placeholder="请输入Host项目基础URL">
                            <button class="btn btn-outline-primary" type="submit">更新</button>
                        </div>
                    </form>
                    <div class="alert alert-info">
                        <small>默认值从配置文件读取，您可以在此处修改以连接到不同的Host项目</small>
                    </div>
                </div>

                <div class="mb-4">
                    <h4>应用ID</h4>
                    <form method="post" class="mb-3">
                        <div class="input-group">
                            <input type="text" class="form-control" name="appId" value="@Model.AppId" placeholder="请输入应用ID">
                            <input type="hidden" name="hostBaseUrl" value="@Model.HostBaseUrl">
                            <button class="btn btn-outline-primary" type="submit">更新</button>
                        </div>
                    </form>
                    <div class="alert alert-info">
                        <small>应用ID用于标识来源应用，对应身份验证接口中的appid参数</small>
                    </div>
                </div>

                <div class="mb-4">
                    <h4>自动登录链接</h4>
                    <div class="input-group mb-3">
                        <input type="text" class="form-control" value="@Model.FullAutoLoginUrl" id="autoLoginUrl" readonly>
                        <button class="btn btn-outline-secondary" type="button" onclick="copyToClipboard('autoLoginUrl')">复制</button>
                    </div>
                    <a href="@Model.FullAutoLoginUrl" target="_blank" class="btn btn-primary">
                        <i class="fas fa-external-link-alt me-2"></i>点击自动登录到工作流引擎
                    </a>
                </div>

                <div class="mb-4">
                    <h4>技术说明</h4>
                    <div class="accordion" id="accordionExample">
                        <div class="accordion-item">
                            <h2 class="accordion-header" id="headingOne">
                                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
                                    自动登录原理
                                </button>
                            </h2>
                            <div id="collapseOne" class="accordion-collapse collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                                <div class="accordion-body">
                                    <p>自动登录使用了WorkFlowCore.Host项目中的<code>AutoLogin</code>接口，该接口支持通过第三方平台的Token进行身份验证。</p>
                                    <p>详细流程如下：</p>
                                    <ol>
                                        <li><strong>从当前业务系统获取JWT Token</strong>
                                            <ul>
                                                <li>业务系统（如本演示项目）在用户登录时生成JWT Token</li>
                                                <li>Token中包含用户ID、用户名、员工编号等身份信息</li>
                                                <li>Token使用业务系统的密钥签名，确保数据完整性和真实性</li>
                                            </ul>
                                        </li>
                                        <li><strong>构建指向WorkFlowCore.Host的自动登录URL</strong>
                                            <ul>
                                                <li>将业务系统的JWT Token作为<code>thirdpartauthorization</code>参数</li>
                                                <li>添加<code>appid</code>参数标识来源应用，用于多应用场景下的身份识别</li>
                                                <li>完整URL格式：<code>{hostBaseUrl}/api/Account/AutoLogin?appid={appId}&thirdpartauthorization={token}</code></li>
                                            </ul>
                                        </li>
                                        <li><strong>WorkFlowCore.Host接收请求并验证Token</strong>
                                            <ul>
                                                <li>WorkFlowCore.Host使用<code>DefaultCustomizationVerifyExtension</code>组件处理验证</li>
                                                <li>该组件根据配置从请求中提取Token（默认从headers中的<code>ThirdpartAuthorization</code>字段）</li>
                                                <li>将Token发送到配置的验证接口（即本系统的<code>/api/Account/VerifyToken</code>接口）</li>
                                                <li>验证接口解析Token，验证签名，并返回用户信息</li>
                                            </ul>
                                        </li>
                                        <li><strong>验证通过后，WorkFlowCore.Host生成自己的Token并完成登录</strong>
                                            <ul>
                                                <li>验证接口返回的用户信息包括：用户ID、用户名、是否管理员、应用ID等</li>
                                                <li>WorkFlowCore.Host根据这些信息生成自己的内部Token</li>
                                                <li>用户无需再次输入账号密码，即可直接访问WorkFlowCore.Host的功能</li>
                                            </ul>
                                        </li>
                                    </ol>
                                    <p><strong>身份验证接口与自动登录的关系：</strong></p>
                                    <p>身份验证接口（<code>/api/Account/VerifyToken</code>）是整个自动登录流程的核心环节，它负责：</p>
                                    <ul>
                                        <li>验证来自WorkFlowCore.Host的Token请求</li>
                                        <li>解析JWT Token并验证其有效性</li>
                                        <li>提取用户身份信息并返回标准格式的验证结果</li>
                                        <li>支持多种请求方式（GET/POST）和参数位置（headers/query/form）</li>
                                    </ul>
                                    <p>通过这种方式，实现了业务系统与WorkFlowCore工作流引擎之间的无缝单点登录，用户只需在业务系统登录一次，即可直接访问工作流引擎的功能。</p>
                                </div>
                            </div>
                        </div>
                        <div class="accordion-item">
                            <h2 class="accordion-header" id="headingTwo">
                                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                    URL参数说明
                                </button>
                            </h2>
                            <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
                                <div class="accordion-body">
                                    <p>自动登录URL包含以下参数：</p>
                                    <ul>
                                        <li><code>appid</code>: 应用ID，用于标识来源应用，对应身份验证接口中的appid参数</li>
                                        <li><code>thirdpartauthorization</code>: 第三方授权信息，即当前业务系统的JWT Token，对应身份验证接口中的authorization参数</li>
                                    </ul>
                                    <p><strong>参数传递与处理流程：</strong></p>
                                    <ol>
                                        <li>参数通过URL Query String方式传递给WorkFlowCore.Host</li>
                                        <li>WorkFlowCore.Host的<code>DefaultCustomizationVerifyExtension</code>组件根据配置提取参数</li>
                                        <li>默认配置下，<code>token-from</code>为headers，<code>token-key</code>为ThirdpartAuthorization</li>
                                        <li>组件将参数转发到验证接口，默认以<code>authorization</code>作为参数名</li>
                                        <li>验证接口支持从headers、query、form三种位置获取参数</li>
                                    </ol>
                                    <p>这种灵活的参数传递机制使得系统可以适应不同的集成场景和安全要求。</p>
                                </div>
                            </div>
                        </div>
                        <div class="accordion-item">
                            <h2 class="accordion-header" id="headingThree">
                                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                    Token内容
                                </button>
                            </h2>
                            <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
                                <div class="accordion-body">
                                    <p>当前JWT Token包含以下信息：</p>
                                    <pre class="bg-light p-3"><code>@Model.Token</code></pre>
                                    <p><strong>JWT Token结构说明：</strong></p>
                                    <p>JWT Token由三部分组成，以点(.)分隔：</p>
                                    <ol>
                                        <li><strong>Header（头部）</strong>：包含Token类型和使用的签名算法</li>
                                        <li><strong>Payload（负载）</strong>：包含声明（Claims），主要包括：
                                            <ul>
                                                <li><code>nameid</code>：用户ID</li>
                                                <li><code>unique_name</code>：用户名</li>
                                                <li><code>email</code>：用户邮箱</li>
                                                <li><code>EmployeeNumber</code>：员工编号</li>
                                                <li><code>exp</code>：过期时间</li>
                                                <li><code>iss</code>：签发者</li>
                                                <li><code>aud</code>：接收者</li>
                                            </ul>
                                        </li>
                                        <li><strong>Signature（签名）</strong>：使用密钥对Header和Payload进行签名，确保数据未被篡改</li>
                                    </ol>
                                    <p><strong>与身份验证接口的关系：</strong></p>
                                    <p>身份验证接口（<code>/api/Account/VerifyToken</code>）会解析此Token，验证其有效性，并从中提取用户信息。验证通过后，接口会返回标准格式的用户信息，包括用户ID、用户名、是否管理员等，这些信息将用于WorkFlowCore.Host中创建用户会话。</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            }
            else
            {
                <div class="alert alert-danger">
                    <p>未获取到用户信息，请确保已登录。</p>
                    <a asp-controller="Account" asp-action="Login" class="btn btn-primary">前往登录</a>
                </div>
            }
        </div>
    </div>
</div>

@section Scripts {
    <script>
        function copyToClipboard(elementId) {
            var copyText = document.getElementById(elementId);
            copyText.select();
            copyText.setSelectionRange(0, 99999);
            navigator.clipboard.writeText(copyText.value);
            
            // 显示复制成功提示
            var button = event.currentTarget;
            var originalText = button.innerText;
            button.innerText = "已复制!";
            setTimeout(function() {
                button.innerText = originalText;
            }, 2000);
        }
    </script>
}
